
// IIFE
// 前面的 ( ) 中定义了一个函数
( function(w){
    
    const pc = document.querySelector( '.progress-container' );
    const pb = pc.firstElementChild ;
    const pt = pc.lastElementChild ;

    const duration = 50 ; // 时间间隔(单位是毫秒)
    const increment = 0.1 ; // 每次增长的量(以百分比为单位)

    // 采用"函数表达式"来定义函数
    let progress = function(){
        // 获取 progress-bar 的宽度
        let width = pb.style.width ; // 根据CSS内联样式获取元素宽度
        if( !width ){
            width = '0%';
        }

        let w = width.substring( 0 , width.lastIndexOf( '%' ) ) * 1 ;
        console.log( w );
        w = w + increment ;
        console.log( w );

        if( w > 100 ){
            clearInterval( timer ); // 清除定时器
            return ; // 让函数结束
        }

        width = w + '%' ;

        // 为 progress-bar 的设置新宽度
        pb.style.width = width ;
        // 设置 progress-text 中显示的文本
        pt.innerHTML = width ;
    }

    const timer = setInterval( progress , duration );

} )( window ); // 后面的()是为函数传递实参